/**
 * Created by Administrator on 2017/4/17 0017.
 */
import React from "react";
import { message,Select } from 'antd';
import { Modal } from 'fly';
import Relay from "react-relay";
import ReqPayOrderMutation from "../mutation/ReqPayOrderMutation";
// import Select from "../../../common/Select";
import FindUsersByEnterpriseIdAndPidMutation from "../mutation/FindUsersByEnterpriseIdAndPidMutation";
import Reactkey from "../../../util/ReactKey";
const Option = Select.Option;

export default class Modal_PayFor extends React.Component{
    constructor(props){
        super(props);
        this.state={
            visible:false,
            oid:'',
            account:'',
            inputaccount:'',
            textareadesp:'',
            linkman:[],
            highLight1: false,
            highLight2: false,
            selectid: null
        }
        this.linkman = [{text:'请选择联系人',value:'0'}];
        this.enterpriseId = sessionStorage.getItem('enterpriseId');
        this.selectChange = this.selectChange.bind(this);
    }

    componentWillMount(){
        Relay.Store.commitUpdate(
            new FindUsersByEnterpriseIdAndPidMutation({
                enterpriseId : this.enterpriseId,
                /*销售订单管理权限的用户*/
                pid:'5'
            }),
            {
                onFailure: () => {

                },
                onSuccess: (response) => {

                    let errorCode = response.findUsersByEnterpriseIdAndPid.findUsersByEnterpriseIdAndPid.errorCode;
                    if(errorCode=="0"){
                        let userModelList = response.findUsersByEnterpriseIdAndPid.findUsersByEnterpriseIdAndPid.userModelList;

                        userModelList.map((context,index)=>{
                            this.linkman.push({text:context.name+" "+context.phone,value:context.uid})
                        });
                        this.setState({
                            linkman:this.linkman
                        });
                    }
                }
            }
        )

    }
    _onCancel(){
        this.setState({
            visible:false
        });
    }
    _payFor(){
        let selectid = this.state.selectid;
        if(this.state.inputaccount==''){
            message.info('请填写金额');
            return
        }
        if(this.state.textareadesp==''){
            message.info('请填写申请理由');
            return
        }
        let textareadesp = this.state.textareadesp.replace(/\s/g,'')
        if(textareadesp.length==0){
            message.info('申请理由不能为空');
            return
        }

        if(selectid==0||''){
            message.info('请选择联系人');
            return
        }

        Relay.Store.commitUpdate(
            new ReqPayOrderMutation({
                desp:this.state.textareadesp,
                money:this.state.inputaccount,
                orderId:this.state.oid,
                uid:this.props.uid,
                financeId:selectid
            }),
            {
                onFailure: () => {

                },
                onSuccess: (response) => {
                    let errorCode = response.reqPayOrder.reqPayOrder.errorCode;
                    if(errorCode==0){
                        message.success('申请成功');
                        this.setState({
                            visible:false
                        });
                    }
                }
            }
        )
    }

    changeAccount(e){
        let text = e.target.value;
        let regular = /^[0-9,'.']*$/;
        if(!regular.test(text)){
            return
        }
        this.setState({
            inputaccount:text
        });
    }
    selectChange(value) {
        console.log(value);
        this.setState({
            selectid: value
        })
    }
    changeDesp(e){
        let text = e.target.value;
        this.setState({
            textareadesp:text
        });
    }

    modalAfterClose(){
        this.setState({
            inputaccount:'',
            textareadesp:''
        });
    }
    focus(type) {
        type == 'account' ? (
            this.setState({
                highLight1: true
            })
        ) : (
            this.setState({
                highLight2: true
            })
        )

    }
    blur() {
        this.setState({
            highLight2: false,
            highLight1: false
        })
    }
    render(){
        return (
            <Modal
                title={'付款申请'}
                maskClosable={true}
                okText={'确定'}
                onOk={this._payFor.bind(this)}
                 visible={this.state.visible}
                // visible={true}
                onCancel={this._onCancel.bind(this)}
                afterClose={this.modalAfterClose.bind(this)}
            >
                <div className={'order_orderpurch_modal_payfor_oiddiv'}>订单编号：{this.state.oid}</div>
                <div className={'order_orderpurch_modal_payfor_oiddiv'}>订单金额：￥{this.state.account/100}</div>
                <div className={'order_orderpurch_modal_payfor_oiddiv'}>付款金额：
                <input
                    className={'order_orderpurch_modal_payfor_oidinput'}
                    ref={'accountinput'}
                    onChange={this.changeAccount.bind(this)}
                    value={this.state.inputaccount}
                    onBlur={this.blur.bind(this)}
                    onFocus={this.focus.bind(this,'account')}
                    style={this.state.highLight1 ? {border:'1px solid #36b3b3'} : {}}
                />
                </div>
                <div className={'order_orderpurch_modal_payfor_oiddiv'}>
                    <span className="order_orderpurch_modal_payfor_oidspan">付款理由：</span>
                    <textarea
                        className={'order_orderpurch_modal_payfor_textarea'}
                        ref={'textarea'}
                        value={this.state.textareadesp}
                        onChange={this.changeDesp.bind(this)}
                        onBlur={this.blur.bind(this)}
                        onFocus={this.focus.bind(this, 'plain')}
                        style={this.state.highLight2 ? {border:'1px solid #36b3b3'} : {}}
                    />
                </div>

                <div className={'order_orderpurch_modal_payfor_oiddiv'} ref={"selectBox"}>财&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;务：
                    {/*<Select*/}
                        {/*oArr={this.state.linkman}*/}
                        {/*style={{maginLeft:28,width:272}}*/}
                        {/*ref={'linkmanselect'}*/}
                        {/*key={Reactkey.key}*/}
                    {/*/>*/}
                    <Select defaultValue="请选择联系人"
                            style={{ width: 220 }}
                            onChange={this.selectChange}
                            getPopupContainer={()=>this.refs.selectBox}
                            className="order_creat_select"
                            dropdownClassName="order_creat_select_drop"
                    >
                        {
                            this.state.linkman ? this.state.linkman.map((v,i)=>{
                                return <Option value={v.value}>{v.text}</Option>
                            }) : null
                        }
                    </Select>
                </div>

                {/*<div className={'order_orderpurch_modal_payfor_divforbutton'} onClick={this._payFor.bind(this)}>申请</div>*/}
            </Modal>
        )
    }
}